<template>
  <AModalPro
    v-bind="$attrs"
    title="添加字典"
    :maskClosable="false"
    :confirmLoading="loading"
    @ok="onOk"
    @cancel="handleCancel"
    @close="props.onCancel"
  >
    <AForm ref="formRef" :model="formState" :label-col="{ span: 6 }" :wrapper-col="{ span: 16 }">
      <AFormItem label="字典名称" name="dictName" :rules="dictRules.dictName">
        <AInput v-model:value="formState.dictName" placeholder="请输入字典名称" :maxlength="20"></AInput>
      </AFormItem>
      <AFormItem label="字典类型" name="dictType" :rules="dictRules.dictType">
        <AInput v-model:value="formState.dictType" placeholder="请输入字典类型" :maxlength="50"></AInput>
      </AFormItem>
      <AFormItem label="字典状态" name="status">
        <ARadioGroup v-model:value="formState.status" name="radioGroup">
          <ARadio :value="0">正常</ARadio>
          <ARadio :value="1">停用</ARadio>
        </ARadioGroup>
      </AFormItem>
      <AFormItem label="备注" name="remark" :rules="dictRules.remark">
        <ATextarea v-model:value="formState.remark" placeholder="请输入内容" auto-size :maxlength="500"></ATextarea>
      </AFormItem>
    </AForm>
  </AModalPro>
</template>

<script setup>
import { ref, reactive, toValue } from 'vue';
import { AModalPro } from '@/components/iteration';
import { useState } from '@/hooks';
import { dictRules } from '@/constants/rules';

defineOptions({
  inheritAttrs: false // 禁用透传
});

const props = defineProps({
  onFinish: Function,
  onCancel: Function
});
const initValues = {
  dictName: '',
  dictType: '',
  status: 0,
  remark: ''
};
const formRef = ref();
const formState = reactive(initValues);
const [loading, setLoading] = useState(false);

const handleCancel = () => {
  toValue(formRef).resetFields();
  props.onCancel?.();
};

const onOk = async () => {
  try {
    setLoading(true);
    await toValue(formRef).validate().then(props.onFinish);
    toValue(formRef).resetFields();
  } catch (e) {
    await Promise.reject(e);
  } finally {
    setLoading(false);
  }
};
</script>

<style lang="scss" scoped></style>
